<!DOCTYPE html>
<!--[if IE 8]> <html lang="en" class="ie8"> <![endif]-->  
<!--[if IE 9]> <html lang="en" class="ie9"> <![endif]-->  
<!--[if !IE]><!--> <html lang="en"> <!--<![endif]-->  
<head>
    <title>Responsive Resume/CV Template for Developers</title>
    <!-- Meta -->
    <meta charset="utf-8">
    <meta http-equiv="X-UA-Compatible" content="IE=edge">
    <meta name="viewport" content="width=device-width, initial-scale=1.0">
    <meta name="description" content="Responsive HTML5 Resume/CV Template for Developers">
    <meta name="author" content="zhang xu at 3rd Wave Media">    
    <link rel="shortcut icon" href="favicon.ico">  
    <link href='https://fonts.googleapis.com/css?family=Roboto:400,500,400italic,300italic,300,500italic,700,700italic,900,900italic' rel='stylesheet' type='text/css'>
    <!-- Global CSS -->
    <link rel="stylesheet" href="assets/plugins/bootstrap/css/bootstrap.min.css">   
    <!-- Plugins CSS -->
    <link rel="stylesheet" href="assets/plugins/font-awesome/css/font-awesome.css">
    
    <!-- Theme CSS -->  
    <link id="theme-style" rel="stylesheet" href="assets/css/styles.css">
    <!-- HTML5 shim and Respond.js for IE8 support of HTML5 elements and media queries -->
    <!--[if lt IE 9]>
      <script src="https://oss.maxcdn.com/html5shiv/3.7.2/html5shiv.min.js"></script>
      <script src="https://oss.maxcdn.com/respond/1.4.2/respond.min.js"></script>
    <![endif]-->
    <style>
    #list li{background:pink;float:left;height:50px;width:150px;line-height: 50px;text-align: center;border:3px dotted yellow;margin:0px;}
    #list1 li{background:black;float:left;height:50px;width:100px;line-height: 50px;text-align: center;border:3px solid white;margin:0px;}
    a:hover{color:blueviolet;text-decoration: none;font-size: 24px;}
    a:visited{color:red;}
    #img img{height:150px;width:25%;float:left;}
    #img1 img{height:150px;width:20%;float:left;margin:10px;}
    #cr1{background:pink;height:100px;width:100%;}
    #cr2{background:#15C5F1;height:100px;width:100%;}
    #cr3{background:#F7E70C;height:100px;width:100%;}
    </style>
</head> 
<body style="background:#0084FF;margin:10px;">
        <div class="container">
                <div class="row" >
                    <div class=" col-sm-12" style="text-align:center;">
                <div style="margin:30px;">
                <img class="profile" src="assets/images/shengtuolini.jpg" alt="" />
                <h1 class="name">Zhang Xu</h1>
                <h3 class="tagline">Santorini 圣托里尼</h3>
            </div><!--//profile-container-->
            </div>
            <div class=" col-sm-12" style="margin:30px;padding:0px;">
                <ul class="list-unstyled contact-list" id="list">
                    <li><a href="#">伊亚OIA</a></li>
                    <li><a href="#">蓝顶教堂</a></li>
                    <li><a href="#">费拉Fira</a></li>
                    <li><a href="#">卡马利黑沙滩</a></li>
                    <li><a href="#">佩里萨海滩</a></li>
                    <li><a href="#">红沙滩</a></li>
                </ul>
            </div><!--//contact-container-->
            </div>
            <div class="row" >
            <div class=" col-sm-12">
                <h2 style="font-size:24px;color:mediumspringgreen;text-decoration:underline;text-align:left;">美食</h2>
                <div id="img" style="margin:10px;">
                    <span><img src="assets/images/1.jpg"/></span>
                    <span><img src="assets/images/2.jpg"/></span>
                    <span><img src="assets/images/3.jpg"/></span>
                    <span><img src="assets/images/4.jpg"/></span>
                </div><!--//item-->
            </div><!--//education-container-->
            </div>
            <div class="row" >
                    <div class=" col-sm-12">
           <div>
            <h2 style="font-size:24px;color:rgb(17, 255, 255);text-decoration:underline;text-align:left;">美景</h2>
            <div id="img1">
                <span><img src="assets/images/5.jpg"/></span>
                <span><img src="assets/images/6.jpg"/></span>
                <span><img src="assets/images/7.jpg"/></span>
                <span><img src="assets/images/8.jpg"/></span>
            </div><!--//item-->
            </div><!--//interests-->
            <div style="height:200px;"></div>
            <div>
            <div id="cr1"><i class="fa fa-heart"></i></div>
            <div id="cr2"><i class="fa fa-heart"></i></div>
            <div id="cr3"><i class="fa fa-heart"></i></div>
            </div>
            <div>
                <ul class="list-unstyled contact-list" id="list1">
                        <li><a href="#"><i class="fa fa-weibo"></i></a></li>
                        <li><a href="#"><i class="fa fa-cloud-download"></i></a></li>
                        <li><a href="#"><i class="fa fa-download"></i></a></li>
                        <li><a href="#"><i class="fa fa-heart-o"></i></a></li>
                        <li><a href="#"><i class="fa fa-share"></i></a></li>
                        <li><a href="#"><i class="fa fa-star"></i></a></li>
                    </ul>
            </div>
    <footer class="footer">
        <div class="text-center">
                <!--/* This template is released under the Creative Commons Attribution 3.0 License. Please keep the attribution link below when using for your own project. Thank you for your support. :) If you'd like to use the template without the attribution, you can check out other license options via our website: themes.3rdwavemedia.com */-->
                <small class="copyright">Designed with <i class="fa fa-heart"></i> by <a href="http://themes.3rdwavemedia.com" target="_blank">zhangxu</a> for developers</small>
        </div><!--//container-->
    </footer><!--//footer-->
 
    <!-- Javascript -->          
    <script type="text/javascript" src="assets/plugins/jquery-1.11.3.min.js"></script>
    <script type="text/javascript" src="assets/plugins/bootstrap/js/bootstrap.min.js"></script>    
    <!-- custom js -->
    <script type="text/javascript" src="assets/js/main.js"></script>  
    </div>       
</body>
</html> 

